<%@ page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="vdab" uri="http://vdab.be/tags" %>
<c:set var="contextPath" value="${pageContext.servletContext.contextPath }"/>
<!doctype html>
<html>
<head>
	<title>Cultuurhuis - reserveren</title>
	<link rel="stylesheet" href="${contextPath}/styles/default.css"/>
</head>

<header>
	<div>
		<h1>Het Cultuurhuis: reserveren</h1>
		<img alt="Logo" src="${pageContext.servletContext.contextPath}/images/reserveren.png">
	</div>
	<div>
		<nav>
			<ul class="menu">
				<li>
					<c:url value="/" var="rootURL"></c:url>
					<a href="${rootURL }">Voorstellingen</a>
				</li>
				<c:if test="${not empty bedrag }">
					<li>
		    			<c:url value="/reservatiemandje.htm" var="reservatiemandjeURL"></c:url>
		    			<a href="${reservatiemandjeURL }">Reservatie mandje</a>
	    			</li>
					<li>
		    			<c:url value="/bevestigen.htm" var="bevestigenURL"></c:url>
		    			<a href="${bevestigenURL }">Bevestigen reservatie</a>
	    			</li>
				</c:if>
			</ul>
		</nav>
	</div>	
</header>

<body>
	
	
	<dl>
	  <dt>Voorstelling:</dt><dd>${voorstelling.titel}</dd>
	  <dt>Uitvoerders:</dt><dd>${voorstelling.uitvoerders}</dd>
	  <dt>Datum:</dt><dd>${voorstelling.datum}</dd>
	  <dt>Prijs:</dt><dd>&euro;${voorstelling.prijs}</dd>
	  <dt>Vrije plaatsen</dt><dd>${voorstelling.vrijePlaatsen}</dd>
	</dl> 
	
	<%-- <c:url value="/reservatiemandje.htm" var="reservatiemandjeURL" />
	<form method="get" action="${reservatiemandjeURL}">  --%>
	
	<c:url value="/reserveren.htm" var="reserverenURL" />
	<form method="post" action="${reserverenURL}"> 
	
      <label>Plaatsen:
      <span class="fout">
      	<c:if test="${not empty foutmelding }">
      		Tik een getal tussen 1 en ${voorstelling.vrijePlaatsen }.
      	</c:if>
      </span>
      <input name="plaatsen" value="${plaatsen }" type="number" min="1" max="${voorstelling.vrijePlaatsen}" autofocus="autofocus"></label>
      <input type="hidden" name="voorstellingsNr" value="${voorstelling.voorstellingsNr }">
      <input type="submit" value="Reserveren" >
    </form>
	

</body>
</html>